import { FormProvided, FormItemProvided, FormBasePropsType } from '@/types'
import { computed, inject, reactive } from 'vue'

interface StateType {
    keyForFormItem: symbol
}
export function useFormItem(props: FormBasePropsType) {
    const form = inject<FormProvided | undefined>('form', undefined)
    const formItem = inject<FormItemProvided | undefined>('formItem', undefined)
    const state = reactive<StateType>({
        keyForFormItem: Symbol(),
    })
    return computed(() => {
        return {
            myColor: props.color ?? formItem?.value.color ?? form?.value.color ?? 'default',
            myDisabled: props.disabled ?? formItem?.value.disabled ?? form?.value.disabled ?? false,
            mySize: props.size ?? formItem?.value.size ?? form?.value.size ?? 'm',
            mySharp: props.sharp ?? formItem?.value.sharp ?? form?.value.sharp ?? false,
            ...state,
        }
    })
}